<template>
  <!-- 添加或修改岗位对话框 -->
  <el-dialog v-model="props.modelValue" :title="props.title" :width="props.width" append-to-body>
    <el-form ref="postRef" :model="form" :rules="rules" label-width="80px">
      <el-form-item label="岗位名称" prop="postName">
        <el-input v-model="form.postName" placeholder="请输入岗位名称"/>
      </el-form-item>
      <el-form-item label="岗位编码" prop="postCode">
        <el-input v-model="form.postCode" placeholder="请输入编码名称"/>
      </el-form-item>
      <el-form-item label="岗位顺序1" prop="postSort">
        <el-input-number v-model="form.postSort" controls-position="right" :min="0"/>
      </el-form-item>
      <el-form-item label="岗位状态" prop="status">
        <el-radio-group v-model="form.status">
          <el-radio
              v-for="dict in sys_normal_disable"
              :key="dict.value"
              :value="dict.value"
          >{{ dict.label }}
          </el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="备注" prop="remark">
        <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"/>
      </el-form-item>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="confirm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup>
import {addPost, updatePost} from "@/api/system/post";

const props = defineProps({
  modelValue: {type: Boolean, default: false},
  title: {type: String, default: ""},
  width: {type: String, default: "500px"},
});

const emit = defineEmits(["update:modelValue", "confirm", "cancel"]);

const {proxy} = getCurrentInstance();

const confirm = () => {
  emit("update:modelValue", false);
};

const cancel = () => {
  emit("update:modelValue", false);
};

/**  表单逻辑 */
const {sys_normal_disable} = proxy.useDict("sys_normal_disable");

const data = reactive({
  form: {},
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    postCode: undefined,
    postName: undefined,
    status: undefined,
  },
  rules: {
    postName: [{required: true, message: "岗位名称不能为空", trigger: "blur"}],
    postCode: [{required: true, message: "岗位编码不能为空", trigger: "blur"}],
    postSort: [{required: true, message: "岗位顺序不能为空", trigger: "blur"}],
  },
});

const {queryParams, form, rules} = toRefs(data);

/** 提交按钮 */
function submitForm() {
  proxy.$refs["postRef"].validate(valid => {
    if (valid) {
      if (form.value.postId != undefined) {
        updatePost(form.value).then(response => {
          proxy.$modal.msgSuccess("修改成功");
          open.value = false;
          getList();
        });
      } else {
        addPost(form.value).then(response => {
          proxy.$modal.msgSuccess("新增成功");
          open.value = false;
          getList();
        });
      }
    }
  });
}

</script>

<style scoped lang="scss">

</style>